@extends('layout.home.login')
@section('title')
数码-注册
@stop

@section('content')
<script type="text/javascript">

	
</script>
<div class="res-banner">
	<div class="res-main">
		<div class="login-banner-bg"><span></span><img src="/home/images/big.jpg" /></div>
		<div class="login-box">

				<div class="am-tabs" id="doc-my-tabs">
					<ul class="am-tabs-nav am-nav am-nav-tabs am-nav-justify">
						<li class="am-active"><a href="">邮箱注册</a></li>
						<li><a href="">手机号注册</a></li>
					</ul>
					<a href="/home/login" class="zcnext am-fr am-btn-default">登录</a>
					<div class="am-tabs-bd">
						<div class="am-tab-panel am-active">
					<form action="/home/register/insert" method="post">
						{{ csrf_field() }}		
					    <div class="user-email">
								<label for="email" style="margin-top:2px;height:2px;"><i class="am-icon-envelope-o" ></i></label>
								<input type="email" name="user_email" id="email" placeholder="设置邮箱" value="{{ old('user_email') }}" required>
			         	</div>

			         	<span></span>									
			         	<div class="user-pass">
						    <label for="password" style="margin-top:2px;height:2px;"><i class="am-icon-lock"></i></label>
							<input type="password" name="user_pass" id="password" placeholder="设置6-18位密码" value="{{ old('user_pass') }}" required>
			         	</div>
						
			         	<div class="user-pass">
						    <label for="passwordRepeat" style="margin-top:2px;height:2px;"><i class="am-icon-lock"></i></label>
						    <input type="password" name="repassword" id="passwordRepeat" placeholder="确认密码" value="{{ old('user_pass') }}" required>
			        	</div>	
			        	

			        	<div class="user-pass">						    
						    <input type="text" name="code" placeholder="验证码" required style="width:200px;margin-top:20px;">
						    <img src="/code" alt="" title="点击更换" onclick="this.src=this.src+'?a=1'" style="margin-top:21px;float:right;">
			        	</div>	
			        	<span><p style="font-size:12px;color:red;">{{ session('error') }}</p></span>
			         	<div class="am-cf" style="position:relative;top:20px;">
							<input type="submit" name="" value="注册" class="am-btn am-btn-primary am-btn-sm am-fl">
						</div>
			    	</form>
			
					
						</div>
		
						<div class="am-tab-panel">
							<form action="/home/register/insert2" method="post">
								{{ csrf_field() }}
								<div class="user-phone">
									<label for="phone" ><i class="am-icon-mobile-phone am-icon-md"></i></label>
									<input type="tel" name="user_phone" id="phone" placeholder="请输入手机号" required>
								</div>
								<span></span>																	
								<div class="verification">
									<label for="code" style="margin-top:2px;height:2px;"><i class="am-icon-code-fork"></i></label>
									<input type="tel" name="phone_code" id="code" placeholder="请输入验证码" required>
									<a class="btn" href="javascript:void(0);" onClick="get_mobile_code()" id="sendMobileCode">
										<span id="dyMobileButton">获取</span></a>
								</div>
									<div class="user-pass">
									<label for="password" style="margin-top:2px;height:2px;"><i class="am-icon-lock"></i></label>
									<input type="password" name="user_pass" id="password" placeholder="设置密码" required>
									</div>										
								<div class="user-pass">
									<label for="passwordRepeat"><i class="am-icon-lock" style="margin-top:2px;height:2px;"></i></label>
									<input type="password" name="repassword" id="passwordRepeat" placeholder="确认密码" required>
								</div>
								<span></span>
								<div class="user-pass">						    
								    <input type="text" name="code" placeholder="验证码" required style="width:200px;margin-top:20px;">
								    <img src="/code" alt="" title="点击更换" onclick="this.src=this.src+'?a=1'" style="margin-top:21px;float:right;">
				        		</div>	
				        		<span><p style="font-size:12px;color:red;">{{ session('error1') }}</p></span>
								<div class="am-cf">
									<input type="submit" name="" value="注册" class="am-btn am-btn-primary am-btn-sm am-fl">
								</div>
							</form>																				
							<hr>
						</div>
						
						<script>
							$(function() {
							    $('#doc-my-tabs').tabs();
							  })
						</script>

				</div>
			</div>

	</div>
</div>

<!-- 邮箱注册js -->
<script type="text/javascript">
	// 邮箱验证开始
	var form =document.forms[0];
	var form1 =document.forms[1];
	var phone = document.getElementById('phone');
	var span = document.getElementsByTagName('span');			    			
	// 邮箱获取焦点
	form.email.onfocus = function(){

		span[1].innerHTML = '<p style="font-size:12px;color:#666;">正确的邮箱格式为shuma@163.com</p>';
	}
	// 邮箱失去焦点
	form.email.onblur = function(){
		var reg = /^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/g;
		// 检测邮箱是否合格
		if(!reg.test(this.value)){
			span[1].innerHTML = '<p style="font-size:12px;color:red;">邮箱格式不正确</p>';
			return false;
		}
		$.ajaxSetup({
	        headers: {
	            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
	        }
		});
		// 发送ajax  post的方式
		$.post('/home/register/email',{user_email:this.value},function(str){
			if(str == 1){
				span[1].innerHTML = '<p style="font-size:12px;color:green;">恭喜:邮箱可用</p>';									
			}else if(str == 2){
				span[1].innerHTML = '<p style="font-size:12px;color:red;">抱歉:邮箱已被注册</p>';
				return false;
			}
		})								
	}
	// 手机号码sj验证
	form1.user_phone.onfocus = function(){
		span[3].innerHTML = '<p style="font-size:12px;color:#666;">请输入正确的手机号码</p>';
	}
	// 手机失去焦点
	form1.user_phone.onblur = function(){
		var reg1 = /^\d{11}$/;
		// 检测手机是否合格
		if(!reg1.test(this.value)){
			span[3].innerHTML = '<p style="font-size:12px;color:red;">手机号码格式不正确</p>';
			return false;
		}
		$.ajaxSetup({
	        headers: {
	            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
	        }
		});
		// 发送ajax  post的方式
		$.post('/home/register/phonetest',{user_phone:this.value},function(str){
			if(str == 2){
				span[3].innerHTML = '<p style="font-size:12px;color:green;">恭喜:手机号码可用</p>';									
			}else if(str == 1){
				span[3].innerHTML = '<p style="font-size:12px;color:red;">抱歉:手机号码已被注册</p>';
				return false;
			}
		})								
	}
</script>


<!-- 手机注册js -->						
<script language="javascript">
	function get_mobile_code(){
		// alert(1)
		$.ajaxSetup({
	        headers: {
	            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
	        }
		});

		$.post('/home/register/phone', {mobile:jQuery.trim($('#phone').val())}, function(msg) {
            alert(jQuery.trim(unescape(msg)));
			if(msg=='短信发送成功'){
				RemainTime();
			}
        });

	};
	var iTime = 59;
	var Account;
	function RemainTime(){
		document.getElementById('zphone').disabled = true;
		var iSecond,sSecond="",sTime="";
		if (iTime >= 0){
			iSecond = parseInt(iTime%60);
			iMinute = parseInt(iTime/60)
			if (iSecond >= 0){
				if(iMinute>0){
					sSecond = iMinute + "分" + iSecond + "秒";
				}else{
					sSecond = iSecond + "秒";
				}
			}
			sTime=sSecond;
			if(iTime==0){
				clearTimeout(Account);
				sTime='获取手机验证码';
				iTime = 59;
				document.getElementById('zphone').disabled = false;
			}else{
				Account = setTimeout("RemainTime()",1000);
				iTime=iTime-1;
			}
		}else{
			sTime='没有倒计时';
		}
		document.getElementById('zphone').value = sTime;
	}	
</script>
@endsection